@import "open-color/open-color.scss";

.slider-container {
    padding: 10px 0px;
    &.disabled {
        opacity: 50%;
        cursor: not-allowed;
    
        .slider-track,.slider-thumb {
            cursor: not-allowed;
        }
    }
    .slider-track {
        position: relative;
        height: 4px;
        background-color: var(--color-gray-20);
        border-radius: 2px;
        cursor: pointer;
    }
    .slider-range {
        position: absolute;
        height: 100%;
        background-color: var(--color-primary);
        border-radius: 3px;
    }
    .slider-thumb {
        position: absolute;
        width: 12px;
        height: 12px;
        background-color: $oc-white;
        border: 2px solid var(--color-primary);
        border-radius: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        cursor: grab;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1),
    }
}
